<template>
  <div class="header">
    我是header
    <div class="years">{{data.month}}月{{data.day}}日</div>
  </div>
</template>

<script lang="ts">
import { ref } from 'vue'
export default {
  name: 'myHeader',
  props: {
    month: String,
    day: String
  },
  setup(props, context) {
    let data = ref(props)
    return { data }
  }
}

</script>

<style scoped lang="scss">
a {
  color: #42b983;
}
.header{
  width: 100%;
  height: 50px;
  line-height: 50px;
  position: relative;
  text-align: center;
  background-color: #DDE3E8;
  .years{
    position: absolute;
    top: 0px;
    left: 16px;
    font-size: 12px;
  }
}
</style>
